#userinfo{
  background-color: #f7f7f7;
}
.coupontap{
  position: fixed;
  width: 100%;
  z-index: 10;
}
.taptag{
  position: fixed;
  width: 100%;
  top:44px;
  background-color: #f7f7f7;
}
.tagli{
  display: none;
}
.tagli:first-child{
  display: block;
}
.sliderlist{
  width: 96%;
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
  padding: 10px 2% 0;
}
.coupon-li{
  width: 100%;
  display: inline-block;
  position: relative;
  background-color: @theme-color;
  box-shadow: 0px 1px 0px #f1f1f1;
  img{
    position: absolute;
    width: 100%;
  }
}
.liused{
  @color: #999999;
  .tk-left {
    background-color: @color;
  }
  .tktitle,.tkcount {
    color: @color;
  }
  .tklink {
    border: 0;
    font-size: .8rem;
    background-color: transparent;
    color: @color;
  }
}
.liovertime {
  @color: #999999;
  .tk-left {
    background-color: @color;
  }
  .tktitle,.tkcount {
    color: @color;
  }
  .tklink {
    border: 0;
    font-size: .8rem;
    background-color: transparent;
    color: @color;
  }
}
.tk-left{
  display: inline-block;
  position: relative;
  float: left;
  z-index: 2;
  width: 35%;
  text-align: center;
  color: #fff;
  padding: 20px 0;
  background-color: @theme-color;
  background-image: url(../../images/coupon-icon.png);
  background-position: top left;
  background-size: auto 80%;
  background-repeat: no-repeat;
}
.tkprice{
  font-size: 2rem;
  span{
    margin-left: .2rem;
    font-size: .8rem;
    font-weight: normal;
    font-style: normal;
  }
  em{
    font-size: .8rem;
    font-weight: normal;
    font-style: normal;
  }
}
.tkbefore{
  font-size: .8rem;
}
.tkfrom {
  font-size: .8rem;
}
.tkoverdays {
  position: absolute;
  bottom: .6rem;
  left: 38%;
  font-size: .6rem;
  color: @theme-color;
}
.tkleftpanner {
  height: 120px;
  width: 20px;
  position: absolute;
  top: 50%;
  left: 0;
  margin-top: -60px;
  z-index: 11;
  overflow: hidden;
  span {
    display: block;
    height: 16px;
    width: 16px;
    border-radius: 50%;
    position: relative;
    left: -20px;
    margin: 12px;
    background-color: #f7f7f7;
  }
}
.tkrightpanner {
  height: 120px;
  width: 20px;
  position: absolute;
  top: 50%;
  right: 0;
  margin-top: -60px;
  z-index: 11;
  overflow: hidden;
  span {
    display: block;
    height: 16px;
    width: 16px;
    border-radius: 50%;
    position: relative;
    left: 0px;
    margin: 12px;
    background-color: #f7f7f7;
    box-shadow: 2px 1px 2px #f1f1f1 inset;
  }
}
.tk-right{
  float: right;
  width: 59%;
  padding: .4rem 3% 2.4rem 3%;
  z-index: 2;
  background-color: #ffffff;
}
.tktitle{
  color: #404040;
  em{
    font-size: .6rem;
    color: #ffffff;
    background-color: #4a90e2;
    padding: .2rem .4rem;
    border-radius: .2rem;
    font-style: normal;
    margin-right: .4rem;
  }
  .tkzhe{
    background-color: #f7b851;
  }
  .tkgray{
    background-color: #bfbfbf;
  }
}
.tkcount {
  font-size: .9rem;
  color: #404040;
  margin-bottom: .3rem;
}
.tktamp{
  font-size: .6rem;
  float: left;
  color: #999999;
}
.tklink{
  float: right;
  position: absolute;
  bottom: .6rem;
  right: 1rem;
  font-size: .8rem;
  color: @theme-color;
  border: 1px solid @theme-color;
  padding: .1rem .5rem;
  border-radius: .3rem;
  background-color: #fff;
}
.tklink.disabled{
  opacity: 0;
}
@media screen and (max-width: 320px) {
  .tkcount {
    font-size: .8rem;
  }
  .tklink{
    font-size: .6rem;
    padding: .1rem .4rem;
  }
}